import React, { useState } from 'react';
import styles from './index.less';
import { DatePicker, Button, Table } from 'antd'
// import createHistory from require("history").createBrowserHistory
// import { request } from 'umi'
import DetailModal from '@/pages/detailModal';

const login = () => {

  const [visible, setVisible] = useState({
    visible: false,
    currentValue: ""
  })

  const columns = [
    {
      title: '所属单位',
      dataIndex: 'belongUnit',
      render: (text: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined, record: any) => {
        // console.log(record, 'record');
        return (
          // @ts-ignore
          <a onClick={() => detailModal(record?.belongUnit)} target={'_blank'}>{text}</a>
        )
      },
    },
    {
      title: '地面停车',
      dataIndex: 'backgroundParking',
      render: (text: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined, record: any) => {
        // console.log(record, 'record');
        // @ts-ignore
        return <a onClick={() => detailModal(record?.backgroundParking)} target={'_blank'}>{text}</a>
      },
    },
    {
      title: '地下停车',
      dataIndex: 'undergroundParking',
      render: (text: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined, record: any) => {
        // console.log(record, 'record');
        // @ts-ignore
        return <a onClick={() => detailModal(record?.undergroundParking)} target={'_blank'}>{text}</a>
      },
    },
    {
      title: '合计',
      dataIndex: 'count',
      render: (text: boolean | React.ReactChild | React.ReactFragment | React.ReactPortal | null | undefined, record: any) => {
        // console.log(record, 'record');
        // @ts-ignore
        return <a onClick={() => detailModal(record?.count)} target={'_blank'}>{text}</a>
      },
    },
  ];

  const detailModal = (currentClick: any) => {
    setVisible({visible: true, currentValue: currentClick})
    console.log(currentClick);
  }
  const handleCancel = () => {
    setVisible({ visible: false, currentValue: "" })
  };
  const handleOk = () => {
    setVisible({ visible: false, currentValue: "" })
  };

  const data = [
    {
      key: '1',
      belongUnit: '省委',
      backgroundParking: '25',
      undergroundParking: '30',
      count: '55'
    },
    {
      key: '2',
      belongUnit: '省政府',
      backgroundParking: '11',
      undergroundParking: '35',
      count: '46'
    },
    {
      key: '3',
      belongUnit: '省人大',
      backgroundParking: '20',
      undergroundParking: '20',
      count: '40'
    },
  ];

  return (
    <div>
      <h1 className={styles.title}>登录</h1>
      <Button>点击登录</Button>
      <DatePicker />
      <Table
        columns={columns}
        dataSource={data}
        bordered
        title={() => 'Header'}
        footer={() => 'Footer'}
      />
      <DetailModal
        {...visible}
        visible={visible.visible}
        handleOk={handleOk}
        handleCancel={handleCancel}
      />
    </div>
  );
}

export default login
